<template>
	<view :class="['main_style','main_bg']">
		<view v-if="haveRoot()" style="flex: 1;display: flex;">
			<view v-if="qrList.length == 0" style="flex: 1;display: flex;justify-content: center;align-items: center;">您未有即将失效的二维码</view>
			<view v-else style="flex: 1;display: flex;flex-direction: column;">
				<block v-for="(item,index) in qrList" :key="index">
					<view class="item_class" @click="updateQr(item)">
						<view>{{item.qr_name}}</view>
						<view v-if="item.qr_type == 'pddGroup'">拼多多二维码</view>
						<view v-else>外卖二维码</view>
						<view>还差一天失效</view>
					</view>
				</block>
				
			</view>
			<view class="bottom_upload" @click="uploadQr">上传二维码</view>
		</view>
		<view style="flex: 1;display: flex;" v-if="!haveRoot()">
			<view style="display: flex;justify-content: center;align-items: center;flex: 1;">
				您未有相关的二维码
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				qrList: []
			}
		},
		onLoad() {
			this.fetchData();
		},
		methods: {
			haveRoot() {
				let userInfo = uni.getStorageSync('userInfo');
				// console.log(JSON.stringify(userInfo));
				if (userInfo.user_pid == '1989') return true;
				return false;
			},
			fetchData() {
				uni.showLoading({})
				this.$request.post({
					url: "/mQr/qrList",
					success: (res) => {
						uni.hideLoading();
						console.log(res);
						this.qrList = res;
					},
					fail(failed) {
						uni.hideLoading();
					}
				});
			},
			uploadQr() {
				uni.navigateTo({
					url: "/pages/admin/uploadQr"
				})
			},
			updateQr(item) {
				console.log(item);
				uni.chooseImage({
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						uni.uploadFile({
							url: this.$config.qr_host + "/mQr/uploadQr", //仅为示例，非真实的接口地址
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {
								'user': 'test'
							},
							success: (res) => {
								console.log(res);
								if (res.statusCode != 200) return;
								let data = JSON.parse(res.data);
								if (data.data.url.length > 0) {
									this.$request.post({
										url: "/mQr/updateQr",
										data: {
											qr_url: data.data.url,
											qr_id: item.qr_id
										},
										success(res) {
											uni.hideLoading();
											uni.showToast({
												duration: 2000,
												title: '更新成功',
												icon: 'none'
											})
											console.log(res);
										},
										fail(failed) {
											uni.hideLoading();
										}
									});
								}
							},
							fail: (res) => {
								console.log(res)
							}
						});
					}
				});
			},
		}
	}
</script>

<style lang="stylus" scoped>
	.main_bg {
		background-color #eee;
	}

	.bottom_upload {
		position fixed;
		bottom 20rpx;
		left 20rpx;
		right 20rpx;
		height 88rpx;
		border-radius 44rpx;
		text-align center;
		line-height 88rpx;
		color #fff;
		font-weight bold;
		background: linear-gradient(51deg, #F38200, #FF0000);
	}

	.item_class {
		display flex;
		margin-top 20rpx;
		margin-left 20rpx;
		margin-right 20rpx;
		padding-left 20rpx;
		padding-right 20rpx;
		height 130rpx;
		background-color #fff;
		border-radius 10rpx;
		justify-content space-between;
		align-items center;
	}
</style>
